<template>

    <section class="loginWarpBg">
      <div class="loginBg"></div>
      <div class="loginWarp">
        
        <p class="title">
          <img src="/static/images/title01.png">
        </p>

        <div class="info">

          <div class="item" >
            <p><i class="icon1"></i><input type="text" v-model="mobile" placeholder="请输入手机号码"><span class="sendCode" @click="clickTel">发送验证码</span></p>
          </div>
          <div class="item">
            <p><i class="icon2"></i><input type="text" v-model="captch_code" placeholder="验证码"></p>
          </div>

          <div class="item">
            <p><i class="icon3"></i><input type="password"  v-model="password" placeholder="请输入密码"></p>
          </div>

          <div class="clickBox">
            <button class="register" @click="clickRegister">立 即 注 册</button>
          </div>

          <p class="txtle">点击注册默认您同意<span>《注册协议》</span></p>

          <p class="goLogin">已有账号？<router-link tag="span" :to="{path:'/login'}">前往登录</router-link></p>

        </div>
      </div>

    </section>
</template>
<script>
import axios from 'axios'
import {Post} from '@/config/api.js'
export default {
  name: 'hello',
  data() {
    return {
      mobile: '',
      password: '',
      captch_code:'', // 验证码
      textCheck:false,
      onClickA:false,// 点击当前改变颜色-账号
      onClickB:false// 点击当前改变颜色-密码
    }
  },
  mounted(){
    let h1=$(window).height()
    $('.loginBg,.loginWarpBg').css("height", h1)
  },
  computed:{
    allCheck: function() {
      if (this.nameCheck && this.passwordCheck) {
        return true
      } else {
        return false
      }
    },
    nameCheck() {
      if (this.Input(this.name)) {
        return true
      } else {
        return false
      }
    },
    passwordCheck() {
      if (this.Input(this.password)) {
        return true
      } else {
        return false
      }
    }
  },
  methods: {
    clickText(){
      if(this.allCheck){
        return true
      }else{
        this.textCheck=true
        return false
      }
    },
    async clickTel(){
      let data={
                "type":1,
                "mobile":this.mobile
              }
      await Post('/user/mobile/code',this.$store.state.token,data).then((reg)=>{
        console.log(reg)
        this.captch_code=reg.data.captch_code
      })
    },
    async clickRegister() {

        let name = this.name
        let password = this.password

        let date = {
            "registered_method": "mobile",
            "mobile": this.mobile,
            "password": this.password,
            "avatar":'',
            "captch_code":this.captch_code
        }
        //this.$store.dispatch("isLoading",true)
        await Post('/user',this.$store.state.token,date).then((reg)=>{
            this.clickLogin()
        }).catch(function(err){
          let data={
            static:true,
            txt:{
              type:1,
              message:err.data.message
            }
          }
          this.$store.dispatch("alert",data)
          this.name=''
          this.password=''
        })
        //this.$store.dispatch("isLoading",false)
        //this.$router.push({ path: '/'})
        

    },
    async clickLogin() {

        let name = this.mobile
        let password = this.password

        let date = {
            "grant_type": "password",
            "client_id": "app",
            "client_secret": "8BAk3G10$2EWnN9Frg0SdOIovjQXXGS91gj3waZn",
            "scope": "app",
            "username": name,
            "password": password
        }
        this.$store.dispatch("loading",true)
        await Post('/token',this.$store.state.token,date).then(function(reg){
            let token = reg.data.access_token
            var arr = token.split('');
            var passToken = "";
            for (var i = 0; i < token.length; i++) {
              passToken += arr[i].charCodeAt();
              passToken += "/";
            }
            var lastToken = passToken.substring(0, passToken.length - 1)
            var d = new Date();
            d.setTime(d.getTime() + (604800000));
            var expires = "expires=" + d.toUTCString();
            document.cookie = "login" + "=" + lastToken + "; " + expires;
            this.$store.dispatch("login",token);
            //window.location.reload();
            console.log('登录成功')
            this.$store.dispatch("loading",false)
            this.$router.push({ path: '/choice'})
        }.bind(this)).catch(function(err){
          alert(err.data.message)
        })
        //this.$store.dispatch("loading",false)
        //this.$router.push({ path: '/'})
    },
    //关闭登录窗
    closeLogin(){
      this.$store.dispatch("closeloginBox");
    }

  }
}

</script>
